<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>jQuery在线手册</title>
    <link rel="stylesheet" href="Css/style.css">
    <script src="../../jQuery/jquery-3.3.1.min.js"></script>
</head>
<body>
<div class="jquery-nav">
    <div class="jquery-ul">
        <div class="jquery-dl">
             <div class="jquery-dt">核心</div>
            <div class="jquery-dd">
                <a href="core/jquery-selector.html" class="jquery-li">jQuery([selector,[context]])</a>
                <a href="" class="jquery-li">jQuery(html,[ownerDocument])</a>
                <a href="" class="jquery-li">jQuery(callback)</a>
                <a href="" class="jquery-li">jQuery.holdReady(hold)</a>
                <a href="" class="jquery-li">each(callback)</a>
                <a href="" class="jquery-li">size()</a>
                <a href="" class="jquery-li">length</a>
                <a href="" class="jquery-li">selector</a>
                <a href="" class="jquery-li">context</a>
                <a href="" class="jquery-li">get([index])</a>
                <a href="" class="jquery-li">index([selector|element])</a>
                <a href="" class="jquery-li">data([key],[value])</a>
                <a href="" class="jquery-li">removeData([name|list])</a>
                <a href="" class="jquery-li">queue(element,[queueName])</a>
                <a href="" class="jquery-li">dequeue([queueName])</a>
                <a href="" class="jquery-li">clearQueue([queueName])</a>
                <a href="" class="jquery-li">jQuery.fn.extend(object)</a>
                <a href="" class="jquery-li">jQuery.extend(object)</a>
                <a href="" class="jquery-li">jQuery.noConflict([extreme])</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">属性</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">attr(name|properties|key,value|fn)</a>
                <a href="" class="jquery-li">removeAttr(name)</a>
                <a href="" class="jquery-li">prop(name|properties|key,value|fn)</a>
                <a href="" class="jquery-li">removeProp(name)</a>
                <a href="" class="jquery-li">addClass(class|fn)</a>
                <a href="" class="jquery-li">removeClass([class|fn])</a>
                <a href="" class="jquery-li">toggleClass(class|fn[,sw])</a>
                <a href="" class="jquery-li">html([val|fn])</a>
                <a href="" class="jquery-li">text([val|fn])</a>
                <a href="" class="jquery-li">val([val|fn|arr])</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">css</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">css(name|pro|[,val|fn])</a>
                <a href="" class="jquery-li">jQuery.cssHooks</a>
                <a href="" class="jquery-li">offset([coordinates])</a>
                <a href="" class="jquery-li">position()</a>
                <a href="" class="jquery-li">scrollTop([val])</a>
                <a href="" class="jquery-li">scrollLeft([val])</a>
                <a href="" class="jquery-li">height([val|fn])</a>
                <a href="" class="jquery-li">width([val|fn])</a>
                <a href="" class="jquery-li">innerHeight()</a>
                <a href="" class="jquery-li">innerWidth()</a>
                <a href="" class="jquery-li">outerHeight([options])</a>
                <a href="" class="jquery-li">outerWidth([options])</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">选择器</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">#id</a>
                <a href="" class="jquery-li">element</a>
                <a href="" class="jquery-li">.class</a>
                <a href="" class="jquery-li">*</a>
                <a href="" class="jquery-li">selector1,selector2,selectorN</a>
                <a href="" class="jquery-li">ancestor descendant</a>
                <a href="" class="jquery-li">parent > child</a>
                <a href="" class="jquery-li">prev + next</a>
                <a href="" class="jquery-li">prev ~ siblings</a>
                <a href="" class="jquery-li">:first</a>
                <a href="" class="jquery-li">:not(selector)</a>
                <a href="" class="jquery-li">:even</a>
                <a href="" class="jquery-li">:odd</a>
                <a href="" class="jquery-li">:eq(index)</a>
                <a href="" class="jquery-li">:gt(index)</a>
                <a href="" class="jquery-li">:lang(language)</a>
                <a href="" class="jquery-li">:last()</a>
                <a href="" class="jquery-li">:lt(index)</a>
                <a href="" class="jquery-li">:animated</a>
                <a href="" class="jquery-li">:focus</a>
                <a href="" class="jquery-li">:root</a>
                <a href="" class="jquery-li">:target</a>
                <a href="" class="jquery-li">:contains(text)</a>
                <a href="" class="jquery-li">:empty</a>
                <a href="" class="jquery-li">:has(selector)</a>
                <a href="" class="jquery-li">:parent</a>
                <a href="" class="jquery-li">:hidden</a>
                <a href="" class="jquery-li">:visible</a>
                <a href="" class="jquery-li">[attribute]</a>
                <a href="" class="jquery-li">[attribute=value]</a>
                <a href="" class="jquery-li">[attribute!=value]</a>
                <a href="" class="jquery-li">[attribute^=value]</a>
                <a href="" class="jquery-li">[attribute$=value]</a>
                <a href="" class="jquery-li">[attribute*=value]</a>
                <a href="" class="jquery-li">[selector1][selector2][selectorN]</a>
                <a href="" class="jquery-li">:first-child</a>
                <a href="" class="jquery-li">:first-of-type</a>
                <a href="" class="jquery-li">:last-child</a>
                <a href="" class="jquery-li">:last-of-type</a>
                <a href="" class="jquery-li">:nth-child</a>
                <a href="" class="jquery-li">:nth-last-child(n|even|odd|formula)</a>
                <a href="" class="jquery-li">:nth-last-of-type(n|even|odd|formula)</a>
                <a href="" class="jquery-li">:nth-of-type(n|even|odd|formula)</a>
                <a href="" class="jquery-li">:only-child</a>
                <a href="" class="jquery-li">:only-of-type</a>
                <a href="" class="jquery-li">:input</a>
                <a href="" class="jquery-li">:text</a>
                <a href="" class="jquery-li">:password</a>
                <a href="" class="jquery-li">:radio</a>
                <a href="" class="jquery-li">:checkbox</a>
                <a href="" class="jquery-li">:submit</a>
                <a href="" class="jquery-li">:image</a>
                <a href="" class="jquery-li">:reset</a>
                <a href="" class="jquery-li">:button</a>
                <a href="" class="jquery-li">:file</a>
                <a href="" class="jquery-li">:hidden</a>
                <a href="" class="jquery-li">:enabled</a>
                <a href="" class="jquery-li">:disabled</a>
                <a href="" class="jquery-li">:checked</a>
                <a href="" class="jquery-li">:selected</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">文档处理</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">append(content|fn)</a>
                <a href="" class="jquery-li">appendTo(content)</a>
                <a href="" class="jquery-li">prepend(content)</a>
                <a href="" class="jquery-li">prependTo(content)</a>
                <a href="" class="jquery-li">after(content|fn)</a>
                <a href="" class="jquery-li">before(content|fn)</a>
                <a href="" class="jquery-li">insertAfter(content)</a>
                <a href="" class="jquery-li">insertBefore(content)</a>
                <a href="" class="jquery-li">wrap(html|element|fn)</a>
                <a href="" class="jquery-li">unwrap()</a>
                <a href="" class="jquery-li">wrapAll(html|ele)</a>
                <a href="" class="jquery-li">wrapInner(htm|element|fnl)</a>
                <a href="" class="jquery-li">replaceWith(content|fn)</a>
                <a href="" class="jquery-li">replaceAll(selector)</a>
                <a href="" class="jquery-li">empty()</a>
                <a href="" class="jquery-li">remove([expr])</a>
                <a href="" class="jquery-li">detach([expr])</a>
                <a href="" class="jquery-li">detach([expr])</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">筛选</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">eq(index|-index)</a>
                <a href="" class="jquery-li">first()</a>
                <a href="" class="jquery-li">last()</a>
                <a href="" class="jquery-li">hasClass(class)</a>
                <a href="" class="jquery-li">filter(expr|obj|ele|fn)</a>
                <a href="" class="jquery-li">is(expr|obj|ele|fn)</a>
                <a href="" class="jquery-li">map(callback)</a>
                <a href="" class="jquery-li">has(expr|ele)</a>
                <a href="" class="jquery-li">not(expr|ele|fn)</a>
                <a href="" class="jquery-li">slice(start, [end])</a>
                <a href="" class="jquery-li">children([expr])</a>
                <a href="" class="jquery-li">closest(expr|object|element)</a>
                <a href="" class="jquery-li">find(expr|obj|ele)</a>
                <a href="" class="jquery-li">next([expr])</a>
                <a href="" class="jquery-li">nextAll([expr])</a>
                <a href="" class="jquery-li">nextUntil([exp|ele][,fil])</a>
                <a href="" class="jquery-li">offsetParent()</a>
                <a href="" class="jquery-li">parent([expr])</a>
                <a href="" class="jquery-li">parents([expr])</a>
                <a href="" class="jquery-li">parentsUntil([expr|element][,filter])</a>
                <a href="" class="jquery-li">prev([expr])</a>
                <a href="" class="jquery-li">prevAll([expr])</a>
                <a href="" class="jquery-li">prevUntil([exp|ele][,fil])</a>
                <a href="" class="jquery-li">siblings([expr])</a>
                <a href="" class="jquery-li">add(expr|ele|html|obj[,con])</a>
                <a href="" class="jquery-li">andSelf()</a>
                <a href="" class="jquery-li">contents()</a>
                <a href="" class="jquery-li">end()</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">事件</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">ready(fn)</a>
                <a href="" class="jquery-li">on(events,[selector],[data],fn)</a>
                <a href="" class="jquery-li">off(events,[selector],[fn])</a>
                <a href="" class="jquery-li">bind(type,[data],fn)</a>
                <a href="" class="jquery-li">one(type,[data],fn)</a>
                <a href="" class="jquery-li">trigger(type,[data])</a>
                <a href="" class="jquery-li">triggerHandler(type, [data])</a>
                <a href="" class="jquery-li">unbind(type,[data|fn]])</a>
                <a href="" class="jquery-li">delegate(selector,[type],[data],fn)</a>
                <a href="" class="jquery-li">undelegate([selector,[type],fn])</a>
                <a href="" class="jquery-li">hover([over,]out)</a>
                <a href="" class="jquery-li">blur([[data],fn])</a>
                <a href="" class="jquery-li">change([[data],fn])</a>
                <a href="" class="jquery-li">click([[data],fn])</a>
                <a href="" class="jquery-li">dblclick([[data],fn])</a>
                <a href="" class="jquery-li">error([[data],fn])</a>
                <a href="" class="jquery-li">focus([[data],fn])</a>
                <a href="" class="jquery-li">focusin([data],fn)</a>
                <a href="" class="jquery-li">focusout([data],fn)</a>
                <a href="" class="jquery-li">keydown([[data],fn])</a>
                <a href="" class="jquery-li">keypress([[data],fn])</a>
                <a href="" class="jquery-li">keyup([[data],fn])</a>
                <a href="" class="jquery-li">mousedown([[data],fn])</a>
                <a href="" class="jquery-li">mouseenter([[data],fn])</a>
                <a href="" class="jquery-li">mouseleave([[data],fn])</a>
                <a href="" class="jquery-li">mousemove([[data],fn])</a>
                <a href="" class="jquery-li">mouseout([[data],fn])</a>
                <a href="" class="jquery-li">mouseover([[data],fn])</a>
                <a href="" class="jquery-li">mouseup([[data],fn])</a>
                <a href="" class="jquery-li">resize([[data],fn])</a>
                <a href="" class="jquery-li">scroll([[data],fn])</a>
                <a href="" class="jquery-li">select([[data],fn])</a>
                <a href="" class="jquery-li">submit([[data],fn])</a>
                <a href="" class="jquery-li">unload([[data],fn])</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">效果</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">show([speed,[easing],[fn]])</a>
                <a href="" class="jquery-li">hide([speed,[easing],[fn]])</a>
                <a href="" class="jquery-li">slideDown([speed],[easing],[fn])</a>
                <a href="" class="jquery-li">slideUp([speed,[easing],[fn]])</a>
                <a href="" class="jquery-li">slideToggle([speed],[easing],[fn])</a>
                <a href="" class="jquery-li">fadeIn([speed],[easing],[fn])</a>
                <a href="" class="jquery-li">fadeOut([speed],[easing],[fn])</a>
                <a href="" class="jquery-li">fadeTo([[speed],opacity,[easing],[fn]])</a>
                <a href="" class="jquery-li">fadeToggle([speed,[easing],[fn]])</a>
                <a href="" class="jquery-li">animate(params,[speed],[easing],[fn])</a>
                <a href="" class="jquery-li">stop([clearQueue],[jumpToEnd])</a>
                <a href="" class="jquery-li">delay(duration,[queueName])</a>
                <a href="" class="jquery-li">finish( [queue ] )</a>
                <a href="" class="jquery-li">jQuery.fx.off</a>
                <a href="" class="jquery-li">jQuery.fx.interval</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">ajax</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">jQuery.ajax(url,[settings])</a>
                <a href="" class="jquery-li">load(url, [data], [callback])</a>
                <a href="" class="jquery-li">jQuery.get(url, [data], [callback], [type])</a>
                <a href="" class="jquery-li">jQuery.getJSON(url, [data], [callback])</a>
                <a href="" class="jquery-li">jQuery.getScript(url, [callback])</a>
                <a href="" class="jquery-li">jQuery.post(url, [data], [callback], [type])</a>
                <a href="" class="jquery-li">ajaxComplete(callback)</a>
                <a href="" class="jquery-li">ajaxError(callback)</a>
                <a href="" class="jquery-li">ajaxSend(callback)</a>
                <a href="" class="jquery-li">ajaxStart(callback)</a>
                <a href="" class="jquery-li">ajaxStop(callback)</a>
                <a href="" class="jquery-li">ajaxSuccess(callback)</a>
                <a href="" class="jquery-li">jQuery.ajaxPrefilter([type],fn)</a>
                <a href="" class="jquery-li">jQuery.ajaxSetup([options])</a>
                <a href="" class="jquery-li">serialize()</a>
                <a href="" class="jquery-li">serializeArray()</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">工具</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">jQuery.support</a>
                <a href="" class="jquery-li">jQuery.browser.version</a>
                <a href="" class="jquery-li">jQuery.each(object, [callback])</a>
                <a href="" class="jquery-li">jQuery.each(object, [callback])</a>
                <a href="" class="jquery-li">jQuery.extend([d],tgt,obj1,[objN])</a>
                <a href="" class="jquery-li">jQuery.grep(array, callback, [invert])</a>
                <a href="" class="jquery-li">jQuery.when(deferreds)</a>
                <a href="" class="jquery-li">jQuery.makeArray(obj)</a>
                <a href="" class="jquery-li">jQuery.map(arr|obj,callback)</a>
                <a href="" class="jquery-li">jQuery.inArray(value,array,[fromIndex])</a>
                <a href="" class="jquery-li">jQuery.toArray()</a>
                <a href="" class="jquery-li">jQuery.merge(first,second)</a>
                <a href="" class="jquery-li">jQuery.unique(array)</a>
                <a href="" class="jquery-li">jQuery.parseJSON(json)</a>
                <a href="" class="jquery-li">jQuery.parseXML(data)</a>
                <a href="" class="jquery-li">jQuery.noop</a>
                <a href="" class="jquery-li">jQuery.proxy(function,context)</a>
                <a href="" class="jquery-li">jQuery.contains(container,contained)</a>
                <a href="" class="jquery-li">jQuery.type(obj)</a>
                <a href="" class="jquery-li">jQuery.isArray(obj)</a>
                <a href="" class="jquery-li">jQuery.isFunction(obj)</a>
                <a href="" class="jquery-li">jQuery.isEmptyObject(obj)</a>
                <a href="" class="jquery-li">jQuery.isPlainObject(obj)</a>
                <a href="" class="jquery-li">jQuery.isWindow(obj)</a>
                <a href="" class="jquery-li">jQuery.isNumeric(value)</a>
                <a href="" class="jquery-li">jQuery.trim(str)</a>
                <a href="" class="jquery-li">jQuery.param(obj,[traditional])</a>
                <a href="" class="jquery-li">jQuery.error(message)</a>
                <a href="" class="jquery-li">$.fn.jquery</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">事件对象</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">event.currentTarget</a>
                <a href="" class="jquery-li">event.data</a>
                <a href="" class="jquery-li">event.delegateTarget</a>
                <a href="" class="jquery-li">event.isDefaultPrevented()</a>
                <a href="" class="jquery-li">event.isImmediatePropagationStopped()</a>
                <a href="" class="jquery-li">event.isPropagationStopped()</a>
                <a href="" class="jquery-li">event.namespace</a>
                <a href="" class="jquery-li">event.pageX</a>
                <a href="" class="jquery-li">event.pageX</a>
                <a href="" class="jquery-li">event.preventDefault()</a>
                <a href="" class="jquery-li">event.relatedTarget</a>
                <a href="" class="jquery-li">event.result</a>
                <a href="" class="jquery-li">event.stopImmediatePropagation()</a>
                <a href="" class="jquery-li">event.stopPropagation()</a>
                <a href="" class="jquery-li">event.target</a>
                <a href="" class="jquery-li">event.timeStamp</a>
                <a href="" class="jquery-li">event.type</a>
                <a href="" class="jquery-li">event.which</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">延迟对象</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">def.done(d,[d])</a>
                <a href="" class="jquery-li">def.fail(failCallbacks)</a>
                <a href="" class="jquery-li">def.reject(args)</a>
                <a href="" class="jquery-li">def.rejectWith(c,[a])</a>
                <a href="" class="jquery-li">def.resolve(args)</a>
                <a href="" class="jquery-li">def.resolveWith(c,[a])</a>
                <a href="" class="jquery-li">def.then(d[,f][,p])</a>
                <a href="" class="jquery-li">def.promise([ty],[ta])</a>
                <a href="" class="jquery-li">def.always(al,[al])</a>
                <a href="" class="jquery-li">def.notify(args)</a>
                <a href="" class="jquery-li">def.notifyWith(c,[a])</a>
                <a href="" class="jquery-li">def.progress(proCal)</a>
                <a href="" class="jquery-li">def.state()</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">回调函数</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">callbacks.add(callbacks)</a>
                <a href="" class="jquery-li">callbacks.disable()</a>
                <a href="" class="jquery-li">callbacks.empty()</a>
                <a href="" class="jquery-li">callbacks.fire(arguments)</a>
                <a href="" class="jquery-li">callbacks.fired()</a>
                <a href="" class="jquery-li">callbacks.fireWith([context][,args])</a>
                <a href="" class="jquery-li">callbacks.has(callback)</a>
                <a href="" class="jquery-li">callbacks.lock()</a>
                <a href="" class="jquery-li">callbacks.locked()</a>
                <a href="" class="jquery-li">callbacks.remove(callbacks)</a>
                <a href="" class="jquery-li">jQuery.callbacks(flags)</a>
            </div>
        </div>
        <div class="jquery-dl">
            <div class="jquery-dt">其他</div>
            <div class="jquery-dd">
                <a href="" class="jquery-li">正则表达式</a>
            </div>
        </div>
    </div>
</div>


<div class="foot">
    <div class="foot-left">
        <a href="index.html">首页</a>
    </div>
    <div class="foot-left active">
        <a href="nav.html">导航</a>
    </div>
    <div class="foot-left">
        <a href="">速查表</a>
    </div>
</div>
<script>
    $(".jquery-dt").on('click',function () {
        var that = $(this).parent(".jquery-dl");
        if(that.hasClass("active")){
            that.removeClass("active");
//            that.children(".jquery-dd").slideUp("slow");
        }else {
            $(".jquery-dl").removeClass("active");
//            $(".jquery-dl").children(".jquery-dd").slideUp("slow");
            that.addClass("active")
//            that.children(".jquery-dd").slideDown("slow");
        }
    });
</script>


</body>
</html>